﻿@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/Admin/_AdminLayout.cshtml";
}
<script src="~/Content/CSS/admin/datetimepicker/jquery-1.9.1.js"></script>
<link href="~/Content/CSS/admin/datetimepicker/jquery-ui-1.10.3.custom.css" rel="stylesheet" />
<script src="~/Content/CSS/admin/datetimepicker/jquery-ui-1.10.3.custom.js"></script>
@using PagedList.Mvc;
@using PagedList;
<div style="background: #fff; text-align: right; height: 60px; width: 100%; font-size: 12px; border: 1px solid #ccc;">
    <span style="font-size: 18px; font-weight: bold; float: left; padding-top: 17px; padding-left: 15px;">DANH SÁCH HÓA ĐƠN
    </span>
    <div style="text-align: right; padding-top: 17px;padding-right:10px;">
        <span>Tổng số hóa đơn: @ViewBag.Count - Chưa liên hệ: @ViewBag.ChuaXuLi</span>
    </div>
</div>
<script>
    $(function () {
        $("#from").datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            numberOfMonths: 2,
            dateFormat: 'dd/mm/yy',
            onClose: function (selectedDate) {
                $("#to").datepicker("option", "minDate", selectedDate);
            }
        });
        $("#to").datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            dateFormat: 'dd/mm/yy',
            numberOfMonths: 2,
            onClose: function (selectedDate) {
                $("#from").datepicker("option", "maxDate", selectedDate);
            }
        });
        $("#indate").datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            dateFormat: 'dd/mm/yy',
            numberOfMonths: 1,
            onClose: function (selectedDate) {
                $("#indate").datepicker("option", "maxDate", selectedDate);
            }
        });
    });
  </script>
<div style="background: #f0f0f0; text-align: center; padding: 8PX; height: 20px; font-size: 14px; font-weight: bold; border-bottom: 1px solid #fff;">
    <div style="float: left; width: 100%;">
        @using (Html.BeginForm("Index", "AdminHoaDon", FormMethod.Get))
        {
            <div id="search-box" style="text-align: left">
                <input type="radio" name="ynRadio" class="radioBtn" value="range" checked="checked" />
                <label for="from">Từ ngày</label>
                <input type="text" id="from" name="from" value="@ViewBag.FromDate"/>
                <label for="to">đến ngày</label>
                <input type="text" id="to" name="to" value="@ViewBag.ToDate"/>
                <input type="radio" name="ynRadio" class="radioBtn" value="theongay" />
                <label for="from">Theo ngày</label>
                <input type="text" id="indate" name="indate" value="@ViewBag.InDate" disabled/>
                <input type="submit" value="Lọc" class="button4" />
                <input type="submit" value="Nhập lại" class="button4" onclick="Reset()"/>
                <script>
                    function Reset() {
                        $("#indate").val("");
                        $("#from").val("");
                        $("#to").val("");
                    }
                    $(".radioBtn").click(function () {
                        $("#in").attr("disabled", true);
                        if ($("input[name=ynRadio]:checked").val() == "theongay") {
                            $("#indate").attr("disabled", false);
                            $("#from").attr("disabled", true);
                            $("#to").attr("disabled", true);
                        }
                        if ($("input[name=ynRadio]:checked").val() == "range") {
                            $("#indate").attr("disabled", true);
                            $("#from").attr("disabled", false);
                            $("#to").attr("disabled", false);
                        }
                    });
                </script>
            </div>
        }

    </div>

</div>
<br />
<div style="float: left">
    <input class="small blue button input" value="Cập nhật danh sách" onclick="CapNhat()" />
    <script>
        function CapNhat() {
            window.location.reload();
        }
    </script>
</div>
<div style="float: right; width: 40%; text-align: right;">
    Hiển thị 
               <select id="HienThi">
                   <option value="5" @if (ViewBag.HienThi == 10)
                                     { @:selected="selected" 
                       }>5</option>
                   <option value="10" @if (ViewBag.HienThi == 10)
                                      { @:selected="selected" 
                       }>10</option>
                   <option value="15" @if (ViewBag.HienThi == 15)
                                      { @:selected="selected" 
                       }>15</option>
                   <option value="20" @if (ViewBag.HienThi == 20)
                                      { @:selected="selected" 
                       }>20</option>
                   <option value="50" @if (ViewBag.HienThi == 50)
                                      { @:selected="selected" 
                       }>50</option>
               </select>
    Sắp xếp
              
               <select id="SapXep">
                   <option value="5" @if (ViewBag.SapXep == 5)
                                     { @:selected="selected" 
                       }>Tất cả</option>
                   <option value="0" @if (ViewBag.SapXep == 0)
                                     { @:selected="selected" 
                       }>Chưa liên hệ</option>
                   <option value="1" @if (ViewBag.SapXep == 1)
                                     { @:selected="selected" 
                       }>Chưa giao hàng</option>
                   <option value="2" @if (ViewBag.SapXep == 2)
                                     { @:selected="selected" 
                       }>Đã giao</option>
                   <option value="3" @if (ViewBag.SapXep == 3)
                                     { @:selected="selected" 
                       }>Mới nhất</option>
                   <option value="4" @if (ViewBag.SapXep == 4)
                                     { @:selected="selected" 
                       }>Cũ nhất</option>
               </select>
    <script>
        $("#HienThi").change(function () {
            var hienthi = $(this).val();
            window.location.href = 'http://' + window.location.host + '/AdminHoaDon/?HienThi=' + hienthi + '&SapXep=@ViewBag.SapXep&from=@ViewBag.FromDate&to=@ViewBag.ToDate&indate=@ViewBag.Indate';

        });
        $("#SapXep").change(function () {
            var sapxep = $(this).val();
            @*window.location.href = 'http://' + window.location.host + '/AdminSanPham/DanhSach/?SapXep=' + sapxep + '&HienThi=' + @ViewBag.HienThi + '&currentFilter=@ViewBag.CurrentFilter' + '&IdDanhMuc=@ViewBag.DanhMuc' + '&IdThuongHieu=@ViewBag.ThuongHieu';*@
            window.location.href = 'http://' + window.location.host + '/AdminHoaDon/?HienThi=@ViewBag.HienThi' + '&SapXep=' + sapxep + '&from=@ViewBag.FromDate&to=@ViewBag.ToDate&indate=@ViewBag.Indate';

        });
    </script>
</div>
<br />
<table cellspacing="0" rules="rows" class="rows" border="1" style="width: 100%; border-collapse: collapse;">
    <tbody>
        <tr class="item_title" style="color: White; background-color: #CCCCCC; font-family: Tahoma; font-size: 12px; font-weight: bold; height: 30px;">
            <th>id</th>
            <th>Ngày lập</th>
            <th>Địa chỉ giao hàng</th>
            <th>Số điện thoại</th>
            <th>Tên khách hàng</th>
            <th>Trạng thái</th>
            <th>Chi tiết</th>
        </tr>
        @{PagedList<BabyToys.Models.HoaDon> hoadons = ViewBag.OnePageOfHoaDon;}
        @foreach (var hoadon in hoadons)
        {
            <tr class="item_row" style="border-color: #F0F0F0; border-style: Solid; height: 40px;">
                <td class="item_float">@hoadon.IdHoaDon</td>
                <td class="item_float">

                    @{
                        DateTime date = new DateTime(2013, 9, 1, 0, 0, 0);
                        string NgayLap=String.Format("{0:d/M/yyyy HH:mm:ss}",@hoadon.NgayLapHD);
                    }
                    @NgayLap
                </td>
                <td class="item_float">@hoadon.DiaChiGiaoHang/td>
                <td class="item_float">1234567890</td>
                <td class="item_float">Trần văn tèo</td>
                <td class="item_float">
                    <select id="@Html.Raw("TrangThai" + hoadon.IdHoaDon)" onchange="CapNhatTrangThai(@hoadon.IdHoaDon)">
                        <option value="1" @if (hoadon.TrangThai == 1)
                                          { @:selected="selected" 
                       }>Chưa liên hệ</option>
                        <option value="2" @if (hoadon.TrangThai == 2)
                                          { @:selected="selected" 
                       }>Chưa giao hàng</option>
                        <option value="3" @if (hoadon.TrangThai == 3)
                                          { @:selected="selected" 
                       }>Đã giao hàng</option>
                    </select>
                    <script>
                        function CapNhatTrangThai(id) {
                            var x = confirm("Bạn có chắc muốn thay đổi trạng thái của hóa đơn này?");
                            if (x == true) {
                                var ten = '#TrangThai' + id;
                                var id = id;
                                var trangthai = $(ten).val();
                                var submitData = {
                                    id: id,
                                    trangthai: trangthai
                                }
                                //alert("chọn: "+trangthai+","+id);
                                $.ajax({
                                    type: "POST",
                                    contentType: "application/json",
                                    url: "/AdminHoaDon/CapNhatTrangThai",
                                    data: JSON.stringify(submitData),

                                });
                                Reload();
                            } else {
                                window.location.reload();
                            }

                        }
                        function Reload() {
                            alert("Cập nhật thành công");
                        }
                    </script>

                </td>
                <td class="item_float">
                    <a href="~/AdminHoaDon/ChiTiet/?id=@hoadon.IdHoaDon">Xem chi tiết</a>
                </td>
            </tr>
        }
    </tbody>
</table>
@Html.PagedListPager((IPagedList)ViewBag.OnePageOfHoaDon, page => Url.Action("Index", new { page, HienThi = ViewBag.HienThi, SapXep = ViewBag.SapXep,from=ViewBag.FromDate,to=ViewBag.ToDate,indate=ViewBag.Indate }), PagedListRenderOptions.OnlyShowFivePagesAtATime)
